<!DOCTYPE html>
<html lang="en">
<head>

<!-- meta使用viewport以确保页面可自由缩放 -->
<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- 引入 jQuery Mobile 样式 -->
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">

<!-- 引入 jQuery 库 -->
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

<!-- 引入 jQuery Mobile 库 -->
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

<link rel="stylesheet" type="text/css" href="css/home.css">

</head>
<body>
	<div data-role="page" id="page1">
			<header data-role="header" data-theme="b">
				<h1>书库</h1>
				<a href="#" class="ui-btn ui-icon-search ui-btn-icon-notext ui-btn-right ui-corner-all">button</a>
			</header>
			<article data-role="content" style="padding: 0;">
				<div class="firstlist">
					<ul>
						<li><a href="">女生</a></li>
						<li><a href="">男生</a></li>
						<li><a href="">出版</a></li>
						<li><a href="">音频</a></li>
						<li><a href="">漫画</a></li>
					</ul>
				</div>
				<div class="secondlist">
					<ul>
						<li>
							<div class="ui-grid-a">
								<div class="ui-block-a"><img src="img/chenghong.jpg"></div>
								<div class="ui-block-b">
									<div class="atitle">古代言情</div>
							        <div class="btitle">152,856册</div>
								</div>
							</div>
						</li>
						<li>
							<div class="ui-grid-a">
								<div class="ui-block-a"><img src="img/chenghong.jpg"></div>
								<div class="ui-block-b">
									<div class="atitle">古代言情</div>
							        <div class="btitle">152,856册</div>
								</div>
							</div>
						</li>
						<li>
							<div class="ui-grid-a">
								<div class="ui-block-a"><img src="img/chenghong.jpg"></div>
								<div class="ui-block-b">
									<div class="atitle">古代言情</div>
							        <div class="btitle">152,856册</div>
								</div>
							</div>
						</li>
						<li>
							<div class="ui-grid-a">
								<div class="ui-block-a"><img src="img/chenghong.jpg"></div>
								<div class="ui-block-b">
									<div class="atitle">古代言情</div>
							        <div class="btitle">152,856册</div>
								</div>
							</div>
						</li>
						<li>
							<div class="ui-grid-a">
								<div class="ui-block-a"><img src="img/chenghong.jpg"></div>
								<div class="ui-block-b">
									<div class="atitle">古代言情</div>
							        <div class="btitle">152,856册</div>
								</div>
							</div>
						</li>
					</ul>
				</div>
				

				<div class="secondlist">
					<ul>
						<li>
							<div class="ui-grid-a">
								<div class="ui-block-a"><img src="img/chenghong.jpg"></div>
								<div class="ui-block-b">
									<div class="atitle">古代言情</div>
							        <div class="btitle">152,856册</div>
								</div>
							</div>
						</li>
						<li>
							<div class="ui-grid-a">
								<div class="ui-block-a"><img src="img/chenghong.jpg"></div>
								<div class="ui-block-b">
									<div class="atitle">古代言情</div>
							        <div class="btitle">152,856册</div>
								</div>
							</div>
						</li>
						<li>
							<div class="ui-grid-a">
								<div class="ui-block-a"><img src="img/chenghong.jpg"></div>
								<div class="ui-block-b">
									<div class="atitle">古代言情</div>
							        <div class="btitle">152,856册</div>
								</div>
							</div>
						</li>
						<li>
							<div class="ui-grid-a">
								<div class="ui-block-a"><img src="img/chenghong.jpg"></div>
								<div class="ui-block-b">
									<div class="atitle">古代言情</div>
							        <div class="btitle">152,856册</div>
								</div>
							</div>
						</li>
					</ul>
				</div>
			</article>
			<footer data-role="footer" data-position="fixed">
				<div data-role="navbar">
			        <ul>
				        <li><a href="bookshelf.html"><img src="img/书架.png" /><br/><span>书架</span></a>
				        </li>
				        <li><a href="home.html"><img src="img/精选.png" /><br/><span>精选</span></a></li>
				        <li><a href="library.html"><img src="img/书库.png" /><br/><span>书库</span></a></li>
				        <li><a href="mine.html"><img src="img/mine.png" /><br/><span>我的</span></a></li>
			        </ul>
			    </div>
			</footer>
		</div>
</body>
</html>